<template>
	<div class='wy-main matching-tendering wei_tendering'>
		<div class="list_tab">
			<h2>基本信息</h2>
			<a-form :form="form" @submit="handleSubmit" class="wy-form">
					<a-row type="flex"  align="middle" >
						<a-col :span="4"><p class="height-100" style='margin-right: 12px; text-align: right;'>登录名：</p></a-col>
						<a-col :span="4"><p class="height-100">{{detail.username}}</p></a-col>
					</a-row>
					<a-row type="flex"  align="middle">
						<a-col :span="4" ><p class="height-100" style='margin-right: 12px; text-align: right;'>用户身份：</p></a-col>
						<a-col :span="4"><p class="height-100">{{detail.type == 2?'企业':'个人'}}</p></a-col>
					</a-row>
					<a-row type="flex"  align="middle">
						<a-col :span="4"><p class="height-100" style='margin-right: 12px; text-align: right;'>真实姓名：</p></a-col>
						<a-col :span="4"><p class="height-100">{{detail.nickName}}</p></a-col>
					</a-row>
				<a-divider class="title-divider" />
				<h2>业务信息</h2>

				<a-form-item v-bind="formItemLayout" label="所属行业">
					<a-select :disabled="disabled" style="width:280px" placeholder='请选择所属行业' v-decorator="[ 'trade']">
						<a-select-option value="">请选择</a-select-option>
						<a-select-option v-for="(itme,index) in list" :key="index" :value="itme.dictKey">
            {{itme.dictValue}}
          </a-select-option>
					</a-select>
				</a-form-item>
				<a-form-item :label-col="{ span: 4 }" :wrapper-col="{ span: 14 }" label="主营业务" >
					<span style="position: absolute; z-index: 10;right: 10px; bottom:-10px;">{{textLength}}/400</span>
					<a-textarea :disabled="disabled"  placeholder="提示：最多不超过300个字" maxlength="400" ref="textarea"   v-decorator="[ 'mainBusiness']" :autosize="{ minRows: 6, maxRows: 10 }" >
					</a-textarea>
				</a-form-item>
				<a-form-item v-bind="formItemLayout" label="网址">
					<a-input :disabled="disabled" v-decorator="[ 'companyWebsite']" placeholder='请输入网址' />
				</a-form-item>
				<a-divider class="title-divider" />
				<h2>联系信息</h2>
				<a-form-item v-bind="formItemLayout" label="国家/地区" >
				    <a-select placeholder='请选择' :disabled="disabled"  v-decorator="[ 'country']" >
				      <a-select-option value="" >请选择</a-select-option>
				      <a-select-option :value="item.areaId" v-for="(item,index) in countryList"  :key="index">{{item.name}}</a-select-option>
				    </a-select>
				</a-form-item>
				<a-form-item v-bind="formItemLayout" label="所在地区">
					<a-row :gutter="8" class="wy-select-min">
						<a-col :span="24">
						    <a-select placeholder='请选择' :disabled="disabled"   @change="getCity"  v-decorator="[ 'province']" class="w-140">
				      			<a-select-option value="" >请选择</a-select-option>
				     		  	<a-select-option :value="item.areaId" v-for="(item,index) in provinceList"  :key="index">{{item.name}}</a-select-option>
						    </a-select>
						    <a-select placeholder='请选择' :disabled="disabled"   v-decorator="[ 'city']" class="w-140">
				      			<a-select-option value="" >请选择</a-select-option>
				     		 	<a-select-option :value="item.areaId" v-for="(item,index) in cityList"  :key="index">{{item.name}}</a-select-option>
						    </a-select>
						</a-col>
					</a-row>
				</a-form-item>
				<a-form-item v-bind="formItemLayout" label="街道地址">
					<a-input :disabled="disabled" v-decorator="[ 'address']" placeholder='请输入街道地址' />
				</a-form-item>
				<a-form-item v-bind="formItemLayout" label="移动电话">
					<a-input :disabled="disabled" v-decorator="[ 'mobile']" placeholder='请输入移动电话' />
				</a-form-item>
			  <a-form-item v-bind="formItemLayout" label="固定电话">
					<a-input :disabled="disabled" v-decorator="[ 'landline']" placeholder='请输入固定电话' />
				</a-form-item>
				<a-form-item v-bind="formItemLayout" label="传真">
					<a-input :disabled="disabled" v-decorator="[ 'fax']" placeholder='请输入传真' />
				</a-form-item>
				<a-form-item v-bind="formItemLayout" label="QQ">
					<a-input :disabled="disabled" v-decorator="[ 'qq']" placeholder='请输入qq账号' />
				</a-form-item>
				<a-form-item v-bind="formItemLayout" label="微信">
					<a-input :disabled="disabled" v-decorator="[ 'wechat']" placeholder='请输入微信账号' />
				</a-form-item>
				<a-form-item v-bind="formItemLayout" label="电子邮箱">
					<a-input :disabled="disabled" v-decorator="[ 'email']" placeholder='请输入电子邮箱' />
				</a-form-item>
				<a-divider class="title-divider" />
				<div class="ant-row ant-form-item">
				<div class="ant-col-4 ant-form-item-label"></div>
				<div class="ant-col-20 ant-form-item-control-wrapper">
					<div class="ant-form-item-control">
						<div class="ant-title">
							<span class="title-span" style="margin-left:-50px; font-size:16px; font-weight:700; ">审核意见</span>
						</div>
					   <div class="ant-radio">
							<a-radio-group v-model="value">
								<!-- v-decorator="['mode']" -->
					    <a-radio :value="107">
					    通过
					    </a-radio>
					    <a-radio :value="108">
					    拒绝
					    </a-radio>
			   	 </a-radio-group>
					 </div>
					 <div class="a-textarea">
						 <a-textarea placeholder="审核意见" v-model="approvalRemarks" style="margin-top: 10px; width: 447px;height:173px;" :rows="4" />
					 </div>
					</div>
				</div>
			</div>
			<div class="ant-row ant-form-item">
				<div class="ant-col-4 ant-form-item-label"></div>
				<div class="ant-col-10 ant-form-item-control-wrapper">
					<div class="ant-form-item-control">
						<span class="ant-form-item-children">
							
							<a-button type="primary"  html-type="submit" >
								{{detail.approvalStatus==107?'关闭':'确认'}}
							</a-button>
             
						</span>
					</div>
				</div>
			</div>
			</a-form>
		</div>
	</div>
</template>
<script>
	import { environment } from '@/environments/environment'
	import {checkTel, checkTelNum, checkEmail} from 'utils/formValidate'
	export default {
		props:['detail'],
		
		data() {
			return {
				uploadUrl: environment.FileUploadUrl + '/fileupload/upload', // 图片上传地址
				FileUploadUrl2:environment.FileUploadUrl2,
         disabled:true,
         loading:false,
         approvalRemarks:'',
         cityList:[],
         provinceList:[],
         countryList:[],
         list:[],
         textLength:0,
         value:107,
				formItemLayout: {
					labelCol: {
						xs: {
							span: 24
						},
						sm: {
							span: 4
						},
					},
					wrapperCol: {
						xs: {
							span: 24
						},
						sm: {
							span: 20
						},
					},
				},
			}
		},
		beforeCreate() {
			this.form = this.$form.createForm(this);
		},
		created() {
			this.getType(25)
			this.gitArea()
			if(this.detail){
				console.log(this.detail)

				let d = this.detail;
			if(d.approvalStatus==107){
          this.value = 108;
        }else{
          this.value = 107;
        }
         this.approvalRemarks = d.approvalRemarks;

          setTimeout(() => {
          	this.form.setFieldsValue({
								address: d.address,
								companyWebsite: d.companyWebsite,
								email: d.email,
								fax: d.fax,
								landline: d.landline,
								trade:d.trade,
								mobile:d.mobile,
								mainBusiness: d.mainBusiness,
								qq: d.qq,
								username: d.username,
								wechat: d.wechat
          })
          			if(d.mainBusiness)this.textLength = d.mainBusiness.length;
          		  if(d.country)this.form.setFieldsValue({country: parseInt(d.country)});
	            	if(d.province)this.form.setFieldsValue({province: parseInt(d.province)});
		            if(d.city)this.form.setFieldsValue({city: parseInt(d.city)});
	            	this.userInfo = d
	            	if (d.country) this.giturl('provinceList',d.country)
	            	if (d.province) this.giturl('cityList',d.province)
          }, 100);
			}
		},
		watch: {},

		mounted: function() {

		},
		methods: {
			                 // 获取字典类型
      getType(type){
        this.$get('/info/commonDict', {
          dictType: type
        }).then((r) => {
          if(type == 3){
            console.log(r)
          }
          switch(type){
            case 25: this.list = r.data.data.rows; break;
          }
        })
      },
						// 获取国家地区
			gitArea(){
				var val = {upid:0}
				this.$get('/info/area',val).then((r) => {
					this.countryList = r.data.data
	            }).catch((e) => {})
			},
						// 获取省级区域
			getProvince(value){
				this.form.setFieldsValue({
					province: '',
					city:''
				})
				this.giturl('provinceList',value)
				
//				var val = {upid:value}
//				this.$get('/info/area',val).then((r) => {
//					this.provinceList = r.data.data
//	            }).catch((e) => {})
			},
			// 获取市级区域
			getCity(value){
				this.form.setFieldsValue({
					city:''
				})
				this.giturl('cityList',value)
//				var val = {upid:value}
//				this.$get('/info/area',val).then((r) => {
//					this.cityList = r.data.data
//	            }).catch((e) => {})
			},
		giturl(name,value){
				var val = {upid:value}
				this.$get('/info/area',val).then((r) => {
					this[name] = r.data.data
	            }).catch((e) => {})
			},

          //认证提交
      handleSubmit(e) {
        
        if(this.detail.approvalStatus==107){
        	this.$emit('cancel');
        	return;
        }
        e.preventDefault();
        this.form.validateFieldsAndScroll((err, values) => {

          if(!err) {
          		 let params = {
          		 	approvalRemarks:this.approvalRemarks,
          		 	approvalStatus:this.value,
          		 	username:this.detail.username
          		 }
                this.$put('/userinfo/approval',params,true).then((r) => {
                if(r.status == 200){
                  this.$message.success(r.data.message);
                  this.form.resetFields();
                  this.$emit('cancel');
                }else{
                  this.$message.error(r.data.message);
                }
                this.loading = false;
              }).catch((e) => {
                this.loading = false;
              })


            }

        });
      },
		}
	}
</script>

<style lang="less" scoped>
	.matching-tendering {
		.list_tab {
			margin-top: 10px;
		}
	}
</style>